<template>
  <!-- 团建活动 -->
  <base-breadcrumb class="leagueActivity-container">
    <searchData :searchData="searchArr" @search="handleSearch"></searchData>
    <a-card :bordered="false">
      <!-- <title-name title="团建活动列表" /> -->
      <div class="pub-table-action-btn">
        <a-button v-btnPermission="'pa_015_add_01'" type="primary" @click="handleUpdate({}, 'add')" v-if="isLeagueManager">新增</a-button>
      </div>
      <div class="pub-table-select-count" style="margin: 10px 0">
        <a-icon type="info-circle" theme="twoTone" />
        <span>
          共计：
          <a>{{ totalInfo.totalNum || 0 }} 个</a>
        </span>
      </div>
      <list-table
        ref="table"
        rowKey="id"
        :columns="columns"
        :request="loadData"
        show-size-changer
        show-quick-jumper
        showPagination="auto"
      >
        <template slot="activityLevel" slot-scope="text, record">
          {{ filterActivityLevel(text) }}
        </template>
        <template slot="action" slot-scope="text, record">
          <MoreButton>
            <a v-btnPermission="'pa_015_loo_04'" @click="handleUpdate(record, 'look')">查看</a>
            <a v-btnPermission="'pa_015_edi_02'" v-if="record.updateAndDelete" @click="handleUpdate(record, 'edit')">编辑</a>
            <a v-btnPermission="'pa_015_del_03'" v-if="record.updateAndDelete" @click="handleUpdate(record, 'delete')">删除</a>
          </MoreButton>
        </template>
      </list-table>
    </a-card>
  </base-breadcrumb>
</template>

<script>
import { STable } from '@/components' // 表格
import { getList, deleteData } from '@/api/partyMasses/leagueManage/leagueActivity.js'
import { packageConfirm } from '@/utils/baseAction.js'
import Selector from '@/components/Select/Selector.vue'
import {  LEAGUE_TYPE_MAP } from '@/config/businessConfig.js'
import { getCurrentLeagueLevel } from '@/api/partyMasses'

const searchArr = [
  {
    name: '团建活动名称',
    value: 'activityName',
    type: 'input'
  },
  {
    name: '活动类型',
    valueKey: 'activityTypeId',
    type: Selector,
    urlType: 'union',
    selectType: 29
  },
  {
    name: '活动级别',
    value: 'activityLevel',
    type: 'select',
    data: Object.keys(LEAGUE_TYPE_MAP).map((key) => {
      return {
        value: key,
        label: LEAGUE_TYPE_MAP[key]
      }
    })
  },
  {
    name: '举行组织名称',
    value: 'youthOrgName',
    type: 'input'
  },
  {
    name: '活动时间',
    value: 'activityTime',
    type: 'timeRange',
    attr: {
      rangeFormat: ['activityStartTime', 'activityEndTime']
    }
  }
]
const columns = [
  {
    title: '序号',
    width: 80,
    dataIndex: 'index',
    customRender() {
      return arguments[2] + 1
    }
  },
  {
    title: '团建活动名称',
    dataIndex: 'activityName'
  },
  {
    title: '活动类型',
    dataIndex: 'activityTypeName'
  },
  {
    title: '举办组织',
    dataIndex: 'youthOrgName',
    ellipsis: true
  },
  {
    title: '活动级别',
    dataIndex: 'activityLevel',
    scopedSlots: { customRender: 'activityLevel' }
  },
  {
    title: '负责人',
    dataIndex: 'principal'
  },
  {
    title: '活动日期',
    dataIndex: 'activityTime'
  },
  {
    title: '创建时间',
    dataIndex: 'createTime'
  },
  {
    title: '操作',
    dataIndex: 'action',
    width: '180px',
    // align: 'center',
    scopedSlots: { customRender: 'action' }
  }
]
export default {
  name:'a'+ Date.now(),
  components: {
    STable,
  },
  data() {
    return {
      totalInfo: {
        totalNum: 0
      },
      searchArr,
      columns: columns,
      queryParam: {},
      isLeagueManager: false, // 是否为团组织管理员
    }
  },
  created() {
    this.getCurrentLeagueLevelReq()
  },
  methods: {
        /**
     * 获取当前登录人的团组织管理等级
     * 如果返回值中有数组不为空，则是管理人员
     */
    async getCurrentLeagueLevelReq() {
      try {
        const res = await getCurrentLeagueLevel()
        this.isLeagueManager = Object.keys(res.data).some(key => res.data[key] && res.data[key].length)
      } catch(e) {
        console.error(e)
      }
    },
    filterActivityLevel(level) {
      return LEAGUE_TYPE_MAP[level] || ''
    },
    /**
     * 处理数据的相关操作（增删改查）
     */
    handleUpdate(data, pageType) {
      const commonHandler = () => {
        this.$router.push({
          path: '/partyMasses/leagueManage/leagueActivity/update',
          query: {
            id: data.id || '',
            pageType: pageType
          }
        })
      }
      const actionMap = {
        add: commonHandler,
        edit: commonHandler,
        look: commonHandler,
        delete: async () => {
          packageConfirm({
            callback: async () => {
              const res = await deleteData({ id: data.id })
              this.$message.success('删除成功')
              this.refreshTable()
            }
          })
        }
      }
      actionMap[pageType] && actionMap[pageType]()
    },
    handleSearch(val = {}) {
      this.queryParam = {
        ...val
      }
      this.refreshTable()
    },
    refreshTable() {
      this.$refs.table.refresh(true)
    },
    async loadData(parameter) {
      const requestParameters = Object.assign({}, { ...parameter }, { query: { ...this.queryParam } })
      return getList(requestParameters).then((res) => {
        this.totalInfo.totalNum = res.totalSize
        return {
          code:200,
          data: res.data,
          currentPage: res.currentPage,
          totalSize: res.totalSize
        }
      })
    }
  }
}
</script>

<style>
</style>